package com.grechur.wanandroidcompose.page


import androidx.activity.compose.BackHandler
import androidx.activity.compose.LocalOnBackPressedDispatcherOwner
import androidx.compose.foundation.background
import androidx.compose.foundation.layout.*
import androidx.compose.material.*
import androidx.compose.material.icons.Icons
import androidx.compose.material.icons.filled.*
import androidx.compose.runtime.*
import androidx.compose.runtime.saveable.rememberSaveable
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Brush
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.vector.ImageVector
import androidx.compose.ui.platform.LocalDensity
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import androidx.lifecycle.viewmodel.compose.viewModel
import androidx.navigation.NavHostController
import androidx.navigation.compose.rememberNavController
import com.google.accompanist.systemuicontroller.rememberSystemUiController
import com.grechur.wanandroidcompose.ui.theme.Purple200
import com.grechur.wanandroidcompose.ui.theme.Purple700
import com.grechur.wanandroidcompose.viewmodel.CoinViewModel
import kotlinx.coroutines.launch

@Composable
fun MainPage(globalNavController: NavHostController,coinViewModel: CoinViewModel) {
    val appBarHeight = 56.dp
    val statusBarDp = with(LocalDensity.current) {
        WindowInsets.statusBars.getTop(this).toDp()
    }

    val scaffoldState = rememberScaffoldState()
    val coroutineScope = rememberCoroutineScope()
    val systemUiController = rememberSystemUiController()
    SideEffect {
        systemUiController.setStatusBarColor(Color.Transparent)
    }
    val navigationItems = listOf<PageBean>(
        PageBean("首页",Icons.Default.Home),
        PageBean("项目",Icons.Default.Work),
        PageBean("导航",Icons.Default.Navigation),
    )
    val drawerState = scaffoldState.drawerState
    var navCurrentIndex by rememberSaveable() {
        mutableStateOf(0)
    }
    Scaffold(
        scaffoldState = scaffoldState,
        topBar = {

            TopAppBar(
                title = {
                    Text(text = "${navigationItems[navCurrentIndex].title?:"Wan Android"}", color = Color.White)
                },
                backgroundColor = Color.Transparent,
                elevation = 0.dp,
                modifier = Modifier
                    .background(
                        Brush.linearGradient(
                            listOf(
                                Purple700, Purple200
                            )
                        )
                    )
                    .height(statusBarDp + appBarHeight)
                    .padding(top = statusBarDp),
                navigationIcon = {
                    IconButton(onClick = {
                        coroutineScope.launch {
                            if (drawerState.isOpen) {
                                drawerState.close()
                            } else {
                                drawerState.open()
                            }
                        }

                    }) {
                        Icon(imageVector = Icons.Default.Menu, contentDescription = "person", tint = Color.White)
                    }
                },

                actions = {
                    Row {
                        IconButton(onClick = {
                            globalNavController.navigate("commonWeb")
                        }) {
                            Icon(imageVector = Icons.Default.TakeoutDining, contentDescription = "commonWeb", tint = Color.White)
                        }

                        IconButton(onClick = {
                            globalNavController.navigate("search")
                        }) {
                            Icon(imageVector = Icons.Default.Search, contentDescription = "search", tint = Color.White)
                        }
                    }
                }
            )
        },
        drawerContent = {
            MinePage(globalNavController, coinViewModel = coinViewModel)
        },
        bottomBar = {
            BottomNavigation(
                backgroundColor = MaterialTheme.colors.surface,
                modifier = Modifier.navigationBarsPadding()
            ) {
                navigationItems.forEachIndexed {index, pageBean ->
                    BottomNavigationItem(selected = index == navCurrentIndex,
                        onClick = { navCurrentIndex = index },
                        label = { Text(text = "${pageBean?.title}")},
                        icon = {
                            Icon(imageVector = pageBean.icon ?: Icons.Default.Home,
                                contentDescription = pageBean.title)
                        },
                        selectedContentColor = Color.Red,
                        unselectedContentColor = Color.Gray
                    )
                }
            }
        }
    ) { padding->
        when (navCurrentIndex) {
            0-> HomePage(globalNavHostController = globalNavController, modifier = Modifier.padding(padding))
            1-> ProjectPage(globalNavHostController = globalNavController, modifier = Modifier.padding(padding))
            2-> NavigationPage(globalNavHostController = globalNavController, modifier = Modifier.padding(padding))
        }
    }
    if (drawerState.isOpen) {
        BackHandler(enabled = true) {
            coroutineScope.launch {
                if (drawerState.isOpen) {
                    drawerState.close()
                }
            }
        }
    }
}

data class PageBean(val title: String?,val icon:ImageVector?)

@Preview
@Composable
fun MainPagePreview() {
    MainPage(rememberNavController(), coinViewModel = viewModel())
}

